<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>系统文章列表</title>
  <link rel="stylesheet" href="../../inc/layui/css/layui.css">
  <link rel="stylesheet" href="../../css/comm.css">
</head>

<body>
  <div class="layui-form" id="search-form">
  </div>
  <table class="layui-hide" id="table" lay-filter="table"></table>
</body>
<script type="text/html" id="infoDom">
  <div id="form" class="layui-form" style="margin-top: 20px">
    <div class="layui-form-item">
      <label class="layui-form-label">标题</label>
      <div class="layui-input-inline">
        <input value="" type="text" name="articleTitle" lay-verify="required" id="articleTitle" autocomplete="off"
          placeholder="请输入标题" class="layui-input" />
      </div>
    </div>
    <div class="layui-form-item">
      <label class="layui-form-label">类别</label>
      <div class="layui-input-inline">
        <select disabled="disabled" name="articleType" lay-filter="articleType" id="articleType"
          lay-filter="articleType" lay-verify="required">
          <option value="1">系统文章</option>
          <option value="2">帮助文档</option>
        </select>
      </div>
    </div>
    <div class="layui-form-item">
      <label class="layui-form-label">详情</label>
      <div class="layui-input-block" style="margin-right:20px;height:320px">
        <textarea id="editor" style="display: none;"></textarea>
      </div>
    </div>
  </div>
</script>
<script type="text/html" id="contentHtml">
  function re(d){
  return 'aaaa';
  }
</script>
<script type="text/javascript" src="../../inc/layui/layui.js"></script>
<script type="text/javascript" src="../../inc/g.js"></script>
<script src="../../inc/ace/ace.js"></script>
<script type="text/javascript" src="../../inc/area.js"></script>
<script type="text/html" id="seeDetail">
  <a class="layui-btn layui-btn-info layui-btn-sm" lay-event="info">查看</a>
</script>
<script type="text/javascript">
  //加载页面
  function pageload() {
    //初始化列表
    Comm.table.render({
      elem: '#table',
      url: config.root + '/admin/article/list/sys', //列表请求接口
      where: { //接口参数
      },
      cols: [
        [{
            type: "radio"
          },
          {
            field: 'articleId',
            title: '文章id'
          },
          {
            field: 'articleTitle',
            title: '标题'
          },
          {
            field: 'articleType',
            title: '类别',
            templet: function (d) {
              return ArticleType(d.articleType)
            }
          },
          {
            field: "articleContent",
            title: "详情",
            width: 450,
            templet: function (d) {
              return d.articleContent.replace(/\s+|<[^>]+>/g, "");
            }
          },
          {
            field: "addTime",
            title: "创建时间",
            templet: function (d) {
              return Comm.format(d.addTime);
            }
          }, {
            field: "updateTime",
            title: "更新时间",
            templet: function (d) {
              return Comm.format(d.updateTime);
            }
          }, {
            field: "",
            title: "操作",
            toolbar: "#seeDetail",
            width: 160
          }
        ]
      ],
      limit: 15, //分页大小
      id: 'table',
      page: true, //是否分页
      height: 'full-' + ($(".layui-form").height() + 50), //计算table底部距离
    });

    //监听table列表里按钮点击事件
    Comm.table.on('tool(table)', function (obj) {
      if (obj.event == 'info') {
        var d = obj.data;
        console.log(d);
        Comm.laytpl($("#infoDom").html()).render(d, function (html) {
          layer.open({
            type: 1,
            title: "查看详情",
            shade: 0.3,
            area: ['800px', '600px'],
            // maxmin: true,
            content: html,
            success: function (layero) {
              $("#editor").val(d.articleContent);
              if (d.articleType) {
                $("#articleType").find("option[value='" + d.articleType + "']").prop("selected", true);
              }
              Comm.SetData(d, 'form');
              Comm.form.render();
              layedit.build('editor'); //建立编辑器
            },
            btnAlign: 'c',
            btn: ['关闭']
          });
        });
      }
      if (obj.event == 'updateEna') {
        AJAX.POST('/admin/article/enable', {
          articleId: obj.data.ArticleID
        }, function (d) {
          if (d.code == 1) {
            layer.msg("启用成功!", {
              icon: 1
            })
            //执行重载
            Comm.table.reload('table');
          } else {
            layer.msg("启用失败!", {
              icon: 5
            })
          }
        })
      } else if (obj.event == 'updateNoEna') {
        if (obj.data.ArticleType == 1) {
          layer.msg("禁止禁用!", {
            icon: 5
          })
        } else {
          AJAX.POST('/admin/article/disable', {
            articleId: obj.data.ArticleID
          }, function (d) {
            if (d.code == 1) {
              layer.msg("禁用成功!", {
                icon: 1
              })
              //执行重载
              Comm.table.reload('table');
            } else {
              layer.msg("禁用失败!", {
                icon: 5
              })
            }
          })
        }
      }
    });
    // 类别
    function ArticleType(i) {
      if (i == 1) {
        return "系统文章";
      } else if (i == 2) {
        return "帮助文档";
      } else {
        return "其他";
      }
    }
  }

  //去标签
  function replaceHtml(d) {
    return d.replace(/\s+|<[^>]+>/g, "");
  }

  function update() {
    var d = Comm.table.checkStatus('table'); //获取选中的数据
    if (d.data.length != 1) {
      Comm.msg("请选择一条数据", 5)
      return;
    }
    save(d.data[0])
  }
  //修改
  function save(d) {
    var index;
    Comm.laytpl($("#infoDom").html()).render(d, function (html) {
      layer.open({
        type: 1,
        title: "修改文章",
        shade: 0.3,
        area: ['800px', '600px'],
        // maxmin: true,
        content: html,
        success: function (layero) {
          if (d.articleContent) {
            $("#editor").html(d.articleContent);
          }
          if (d.articleType) {
            $("#articleType").find("option[value='" + d.articleType + "']").prop("selected", true);
          }
          Comm.SetData(d, 'form');
          Comm.form.render();
          index = layedit.build('editor'); //建立编辑器
        },
        btnAlign: 'c',
        btn: ['保存', '关闭'],
        yes: function (index, layero) {
          d.articleTitle = $("#articleTitle").val();
          console.log(layedit.getContent(index))
          d.articleContent = layedit.getContent(index);
          console.log(d.articleTitle)
          console.log(d.articleContent)
          AJAX.POST("/admin/article/update", d, function (d) {
            if (d.code == 1) {
              //刷新列表
              Comm.table.reload('table');
              Comm.msg("发布成功!", 1);
              layer.closeAll();
            } else {
              Comm.msg("发布失败! [" + d.msg + "]", 5)
            }
          }, true, true)
        }
      });
    })
  }
</script>

</html>